<template>
  <el-tabs v-model="activeName" type="border-card" @tab-click="handleClick">
    <el-tab-pane label="赠品类别" name="gift"></el-tab-pane>
    <el-tab-pane label="超市商品类别" name="suppermark"></el-tab-pane>
    <div>
      <!-- <query-pan></query-pan> -->
      <button-bar @add="onAdd" @edit="onEdit"></button-bar>
      <table-pan ref="kindtable" :active-tab="activeName" @row-click="onRowClick"></table-pan>
      <dlg-update ref="update" @save-ok="onSaveOk"></dlg-update>
    </div>
  </el-tabs>
</template>

<script>
import queryPan from "./index/c_query";
import buttonBar from "./index/c_bntbar";
import tablePan from "./index/c_table";
import dlgUpdate from "./index/d_update";
export default {
  props: {
    active:{type:String,default:''}
  },
  components: { queryPan, buttonBar, tablePan, dlgUpdate }, //,dlgAdd,dlgEdit
  data() {
    return {
      activeName: "gift",
      row: {}
    };
  },
  created() {
    this.SetActive();
  },
  watch: {
    active: function() {
      this.SetActive();
    }
  },
  methods: {
    SetActive() {
      if (this.$props.active !== "") {
        this.activeName = this.$props.active;
      }
    },
    handleClick() {},
    onAdd() {
      let type = this.activeName == "gift" ? 1 : 2;
      this.$refs["update"].Add(type);
    },
    onRowClick(row) {
      this.row = row;
    },
    onEdit() {
      if (typeof this.row.ProductKindID == "undefined") {
        this.$message.error("请选中要修改的行再试！");
        return;
      }
      this.$refs["update"].Edit(this.row);
    },
    onSaveOk() {
      this.$refs["kindtable"].Refresh();
    }
  }
};
</script>